<template>
	<view class="container">
		<view class="head">
			<video class="video" :src="myRoom.bofangUrl"></video>
			<view class="tabs">
				<view class="tab" :class="[tabIndex == 1 ? 'active' : '']" @click="tabIndex = 1">
					<view>
						互动
						<text>{{'('+list.length+')'}}</text>
					</view>
				</view>
				<view class="tab " :class="[tabIndex == 2 ? 'active' : '']" @click="tabIndex = 2"><view>产品列表</view></view>
				<view class="tab " :class="[tabIndex == 3 ? 'active' : '']" @click="tabIndex = 3"><view>公司介绍</view></view>
			</view>

			<view class="user" v-if="tabIndex == 1">
				<view class="left">
					<image class="avatar" :src="companyInfo.logo ? companyInfo.logo : 'https://img0.baidu.com/it/u=1240550681,1913058023&fm=253&fmt=auto&app=138&f=JPEG?w=500&h=500'" />
					<view class="name">{{myRoom.title}}</view>
				</view>
				<!-- 	<view class="btn">
					
					关注企业
				</view> -->
				<view class="btn btn_active" @click="shoucang()">{{shoucangFlag ? '已关注':'关注企业'}}</view>
			</view>
		</view>
		<scroll-view class="scroll-view" :class="tabIndex > 1 ? 'scroll-view1' : ''" scroll-y>
			<view v-if="tabIndex == 1" class="c">
				<view class="commont-data">
					<view class="item" v-for="item in list" :key="item.id">
							<view class="left" v-if="item.type == '1'">
								<view class="custome">
									<image class="avatar" :src="item.portrait ? item.portrait : 'https://img0.baidu.com/it/u=1240550681,1913058023&fm=253&fmt=auto&app=138&f=JPEG?w=500&h=500'" />
									<view class="name">{{item.userName}}：</view>
								</view>
								<view class="text">{{item.content}}</view>
							</view>
							<view class="date">{{item.createAt}}</view>
					</view>
				</view>
			</view>
			<view v-if="tabIndex == 2" class="c">
				<view class="product-data-list">
					<navigator v-for="item in products" :key="item" class="item" :url="`/pages/product/productDetail/productDetail?productId=${item.id}`" hover-class="none">
						<image class="img" :src="item.banarImg" mode="widthFix" />
						<view class="title">{{item.productName}}</view>

						<view class="type-price">
							<view v-if="item.price == 0" class="price">
								询价
							</view>
							<view v-else class="price">
								<text>￥</text>
								{{item.price}}
							</view>
							<view class="type">{{item.brandName}}</view>
						</view>
					</navigator>
				</view>
			</view>
			<view v-if="tabIndex == 3" class="c liveDetail">
				<rich-text v-if="!is563" v-html="decodeURIComponent(companyInfo.details)"></rich-text>
				<rich-text v-if="is563" v-html="decodeURIComponent(myLiveroom.detail)"></rich-text>
			</view>
		</scroll-view>
		<view class="fixed-comment">
			<input placeholder="和主播说点什么吧" />
			<view class="right">
				<image src="https://m.nocexpo.com/statics/js/modules/h5/img/chanp.png" mode="widthFix" />
				<image src="https://m.nocexpo.com/statics/js/modules/h5/img/liwu.png"/>
				<image src="https://m.nocexpo.com/statics/js/modules/h5/img/home.png" mode="widthFix" />
			</view>
		</view>
		<view class="fixed-btn" @click="inquiry()">立即咨询</view>
	</view>
</template>

<script>
import detailApi from '@/api/liveDetail.js';
import commonApi from '@/utils/commonMethod.js';
export default {
	data() {
		return {
			
			id: '',
			list: [],
			//user:{},
			content: '',
			groupId: '',
			oldlength: 0,
			msgTime: 0,  //消息间隔三秒判断   0.可以发送
			oldStatus: 0,  // 0.默认   1.滚动到底部
			isShowFriend: false,
			companyInfo: {},//企业信息
			myRoom: {}, //直播间信息
			products: [],//产品列表
			visitors: [],//访问人员列表
			visitNames: '',//访问人员姓名(逗号分隔)
			visitCount: 0,//访问总数量
			dianzanFlag: false,//需要从后台获取当前登录人是否点过赞  点赞不可取消
			shoucangFlag: false,//需要从后台获取当前登录人是否已收藏  收藏可取消
			dianzanCount: 0,//点赞总数量
			sw_flag: 0,
			//height: '',
			tabIndex: 1,
			serviceTelList: [],
			userInfo: [],
			ifJudged: false,
			defaultZhiBoImg: '',
	
			websock: null,
			lockReconnect: false,//是否真正建立连接
			timeout: 28 * 1000,//30秒一次心跳
			timeoutObj: null,//心跳心跳倒计时
			serverTimeoutObj: null,//心跳倒计时
			timeoutnum: null,//断开 重连倒计时
			tab3Name: '公司介绍',
			tab2Name: '产品列表',
			is563: false,
			isGift: false,  //礼物弹窗
			isProduct: false, //产品弹窗
			isTopUp: false,  //充值弹窗
			pay: 0,  //0.输入金额  1.支付
			isRedEnvelope: false,  //发红包
			rechargeMoney: '',//充值金额
			payType: '',//充值方式
	
			productList: [],//上架产品
			giftList: [],//礼物列表(都有哪些礼物,多少钱,图片等),
			redMoney: '',//红包金额
			redCount: '',//红包个数
			redTitle: '普天同庆',
	
			giftShow: false,   //动态礼物显示控制
			giftSelected: '', //选中的礼物
			redPackageKey: '', //红包key
			whoCome: '',//某某来了
			excellentVideoList: [],//精彩视频列表
      liveRoomId: '',
			videoSearch: {
				page: 1,
				limit: 10,
				liveRoomId:'',
				search: '',
				lastpage: 0,
				totalPage: '',
				userId: '',
				totalCount: 0
			},
			videoLine: {
				noMore: false,
				loading: false,
				noData: false
			},
			firstScorll: 0,
			secondScorll: 0,
			thirdScorll: 0,
			myLiveroom:{},
			dialogHeight: 100, //互动消息的窗口高度
			companyDescHeight: 100, //产品+产品窗口的高度
			
			startTime:'', //进入页面时间
			endTime:'',//离开页面时间
			currentUrl:'',//当前页面全路径
		};
	},
	async onLoad(options) {
		this.liveRoomId = options.roomId
		this.id = options.id
		
		//获取当前用户,如果没有登录用户,判断cookie中是否有游客信息,如果有则获取该游客信息,如果没有则进行创建
		const currentUserValue = await commonApi.currentUserAxios()
		//如果有用户登录,判断是否完善了个人信息
		if (currentUserValue.data.code == 0) {
			this.userInfo = currentUserValue.data.session_user_h5;

		}
		await this.initWebSocket();
		await this.query();
		await this.getServiceTelList();
		await this.getGiftList();//获取礼物列表
		
		await this.getLiveRoomInfo()
	},
	onShow(){
		
		setTimeout(()=> {
			
			if (getApp().globalData.onShow) {
				getApp().globalData.onShow = 0;
				console.log("demo前后台切换之切到前台")
			}
			else {
				console.log("demo页面被切换显示")
				this.startTime = +new Date();
			}
			
		}, 100);
	},
	onHide(){
		setTimeout(() => {
			var that = this
			if (getApp().globalData.onHide) {
				getApp().globalData.onHide = 0;
				console.log("还在当前页面活动")
			}
			else {
				that.endTime = +new Date();
				console.log("demo页面停留时间：" + (that.endTime - that.startTime))
				var stayTime = Math.round((that.endTime - that.startTime)/1000);
			   //这里获取到页面停留时间stayTime，然后了可以上报了
			   this.saveFootPrint(stayTime);
			}
		}, 100)
	},
	onUnload(){
		setTimeout(() => {
			var that = this
			if (getApp().globalData.onHide) {
				getApp().globalData.onHide = 0;
				console.log("还在当前页面活动")
			}
			else {
				that.endTime = +new Date();
				console.log("demo页面停留时间：" + (that.endTime - that.startTime))
				var stayTime = Math.round((that.endTime - that.startTime)/1000);
			   //这里获取到页面停留时间stayTime，然后了可以上报了
			   this.saveFootPrint(stayTime);
			}
		}, 100)
	},
	mounted(){
		
	  
	    // setInterval(this.refreshVisitCount, 120000);
	    this.refreshVisitCount();
	    //获取total_img
	    commonApi.getTotalImg().then(value =>{
	        this.defaultZhiBoImg = value
	    });
		
		const pages = getCurrentPages()
		const currentPage =pages[pages.length - 1]
		this.share_url = currentPage.$page.fullPath
			
	},
	onShareAppMessage: function () {//分享
		return {
			title: this.companyInfo.company + '的直播厅-金诺云展',
      path: this.share_url + "&sourceUserId=" + uni.getStorageSync("userId"),
			desc: this.companyInfo.company + '正在金诺云展视频直播，欢迎围观',
			imageUrl: this.companyInfo.logo,
			success: function (res) {
				console.info(res + '成功');
				wx.showToast({
					title: '分享成功',
				})
				// 转发成功
			},
			fail: function (res) {
				console.log(res + '失败');
				// 转发失败
			},
		 
		}
	 },
	/*分享朋友圈 */
	onShareTimeline: function() {
		return {
			title: this.companyInfo.company = '的直播厅-金诺云展',
      query: 'id=' + this.id + '&roomId=' + this.roomId + '&sourceUserId=' + uni.getStorageSync("userId"),
			imageUrl:  this.companyInfo.logo,
		}
	},
	updated(){
	    // 聊天定位到底部
	    if (this.oldStatus == 1) {
	        //this.swiperInit();
	        let ele = document.getElementById('dialog');
	        ele.scrollTop = ele.scrollHeight;
	        this.oldStatus = 0;
	    }
			
	},
	methods: {
		saveFootPrint(stayTime){
			commonApi.saveFootPrint(this.userInfo.id,this.startTime,stayTime,this.share_url,"直播详情")
			
		},
	 	getLiveRoomInfo(){
			detailApi.getLiveRoomInfo(this.liveRoomId).then(res =>{
				this.myLiveroom = res.data.myLiveroom;
				if(this.userInfo.id = this.id || this.myLiveroom.status == 3){
					this.getMsgContent();
				}
			})
		},
		//初始化weosocket
		initWebSocket() {
			//开发
			let wsuri = "ws://http://local.nocexpo.com//h5/socket/" + this.liveRoomId + "/" + this.userInfo.id;
			//测试
			// let wsuri = "ws://test.noctech.cn/h5/socket/" + T.p('roomId') + "/" + this.userInfo.id;
			//生产
			// let wsuri = "wss://original.nocexpo.com/h5/socket/" + this.liveRoomId + "/" + this.userInfo.id;
			// let wsuri = "ws://5hl2u5r9.shenzhuo.vip:36344/h5/socket/" + T.p('roomId') + "/" + this.userInfo.id;

			// this.websock = new WebSocket(wsuri);
			// this.websock.onmessage = this.websocketonmessage;
			// this.websock.onopen = this.websocketonopen;
			// this.websock.onerror = this.websocketonerror;
			// this.websock.onclose = this.websocketclose;
		},
		async inquiry(){
			
			console.log("inquiry");
			
			//判断是否登录
			this.register = await commonApi.getUserLoginFlag();
			if (this.register) {
			  uni.redirectTo({
			    url: '/pages/account/login/login',
			  })
			}
			
			// window.location.href = '/h5/cloudLiveInquiry.html?id=' + this.id + '&roomId=' + this.liveRoomId;
		},
		/**
		 * 获取精彩视频
		*/
		getExcellentVideo() {
			this.videoLine.loading = true
			detailApi.getExcellentVideo(this.videoSearch).then(res =>{
				this.videoLine.loading = false
				console.log(res)
				this.videoSearch.totalCount = res.data.page.totalCount
				this.videoSearch.totalPage = res.data.page.totalPage
				this.excellentVideoList = [...this.excellentVideoList,...res.data.page.list]
				if (this.videoSearch.totalPage == this.videoSearch.page) {
					this.videoLine.noMore = true
				}
				this.excellentVideoList.forEach((value, index, array) => {
					if (value.videoDuration) {
						value.videoDuration = value.videoDuration.slice(-8)
						if (value.videoDuration.length == 8) {
							let timeArray = value.videoDuration.split(':')
							if (timeArray[0] == '00') {
								timeArray[0] = ''
							} else if (timeArray[0].slice(0, 1) == '0') {
								timeArray[0] = timeArray[0].slice(1) + ':'
							} else {
								timeArray[0] = timeArray[0] + ':'
							}
							value.videoDuration = timeArray[0] + timeArray[1] + ':' + timeArray[2]
						}
					}
				})
			})
		},
		

		query() {
			detailApi.query(this.id,this.liveRoomId).then(res =>{
				this.myRoom = res.data.vo.myLiveroomEntity
				detailApi.browseHistory(4,this.userInfo.id,this.liveroomId,this.myRoom.status).then(response =>{
				});
				this.companyInfo = res.data.vo.nocUserEntity
				
				console.log(this.myRoom)

				this.products = res.data.vo.productEntities
				this.visitors = res.data.vo.browsers
				this.visitNames = res.data.vo.visitNames
				this.visitCount = res.data.vo.nocCompanyDataVo.visitCount
				this.dianzanCount = res.data.vo.nocCompanyDataVo.dianzanCount
				this.dianzanFlag = res.data.vo.nocCompanyDataVo.dianzanFlag
				this.shoucangFlag = res.data.vo.nocCompanyDataVo.shoucangFlag
				this.sw_flag = 1;
			
			})
		},
		toDetail() {
			console.log("toDetail");
		// 	window.location.href = baseURL + "h5/msgchat.html?id=" + this.companyInfo.id;
		},

		shoucang() {
			const result = commonApi.toRegistered(this.userInfo.type);
			if (!result) {
				return
			}
			// let that = this
			this.shoucangFlag = !this.shoucangFlag
			detailApi.shoucang(this.id,this.shoucangFlag,this.liveroomId).then(res =>{
				
			})
		},
		updateShareCount() {
			this.isShowFriend = false
			//todo 保存分享记录

		},
		getMsgContent(){
			detailApi.getMsgContent(this.liveRoomId).then(res =>{
				if (res.data.nocMsgContentVo) {
					this.groupId = res.data.nocMsgContentVo.groupId
					this.list = [...this.list,...res.data.nocMsgContentVo.list]
				}
			})
			
		},
		todetail() {
			if (!this.is563){
				// window.location.href = '/h5/cloudcomp.html?userId=' + T.p('id');
			}
		},
		query1() {
			detailApi.query1(this.id).then(res =>{
				if (res.data.nocMsgContentVo) {
					this.addMsg();
					this.list = [...this.list,...res.data.nocMsgContentVo.list];
				}
			})
		},
		/**
		 * 发送弹幕
		 * @param e
		 * @returns {Promise<void>}
		 */
		// async submit(e) {
		// 	//聊天室定位到底部
		// 	// let ele = document.getElementById('dialog');
		// 	// ele.scrollTop = ele.scrollHeight;
		// 	// this.$refs.contentRef.blur()
		// 	// const result = await judgeIfPhone()
		// 	// if (!result) {
		// 	// 	return
		// 	// }

		// 	if (!this.content || this.msgTime != 0) {
		// 		return;
		// 	}

		// 	//防止频繁刷消息
		// 	this.msgTime = 1;
		// 	setTimeout(() => {
		// 		this.msgTime = 0;
		// 	}, 2000);
			
		// 	detailApi.sendLiveMsg(this.liveroomId,'1',this.content){
				
		// 	}
		// 	this.content = '';
		// },

		//刷新直播观看量
		refreshVisitCount(){
			detailApi.refreshVisitCount(this.liveRoomId).then(res =>{
				this.visitCount = res.data.visitCount;
			})
			
		},
		//获取客服电话
		getServiceTelList() {
			detailApi.getServiceTelList(this.id).then(res =>{
				this.serviceTelList = res.data.serviceTelList;
			})
		},
		//获取礼物列表
		getGiftList() {
			detailApi.getGiftList().then(res =>{
				this.giftList = res.data.list;
			})
		},
		//发送红包
		// sendRedpackage() {
		// 	if (!this.redMoney) {
		// 		layer.open({
		// 			anim: '提示',
		// 			content: '该输入红包金币！',
		// 			btn: ['确定'],
		// 			yes: function (index) {
		// 				layer.close(index)
		// 			}
		// 		});
		// 		return;
		// 	}
		// 	if (!this.redCount) {
		// 		layer.open({
		// 			anim: '提示',
		// 			content: '该输入参与人数！',
		// 			btn: ['确定'],
		// 			yes: function (index) {
		// 				layer.close(index)
		// 			}
		// 		});
		// 		return;
		// 	}
		// 	if (!this.redTitle) {
		// 		this.redTitle = '普天同庆';
		// 	}
		// 	this.isRedEnvelope = false;
		// 	this.giftSelected = '';
		// 	this.isGift = false;
		// 	that = this;
			
		// 	detailApi.sendRedPackage(this.redMoney,this.redCount).then(res =>{
				
		// 		if (res.data.code == 1) {
		// 			//todo 账户余额不足,请充值,刷新账户
		// 			const currentUser = commonApi.currentUserAxios();
		// 			this.userInfo = currentUser.data.session_user_h5;
		// 			layer.open({
		// 				anim: '提示',
		// 				content: '余额不足,请充值',
		// 				btn: ['确定', '取消'],
		// 				yes: function (index) {
		// 					this.isGift = false
		// 					this.isTopUp = true;
		// 					layer.close(index)
		// 				},
		// 				no: function (index) {
		// 					layer.close(index)
		// 					this.isGift = false
		// 				}
		// 			});
		// 		}
		// 		if (res.data.code == 0) {
		// 			detailApi.sendRedPackageMsg(this.liveroomId,'3','发送了红包',res.data.redkey,this.redTitle).then(res =>{
		// 				//显示红包动图
		// 				that.giftShow = true;
		// 				//红包key
		// 				//that.redPackageKey = res.data.redkey;
		// 				//setTimeout(function() {
		// 				//    that.giftShow = false;
		// 				//    }, 5000);
		// 			});
		// 		}

		// 	})
		// },
		// //抢红包
		// grabRedPacket(redkey) {
		// 	//非红包
		// 	if (!redkey && this.giftShow) {
		// 		return;
		// 	}
		// 	const result = toRegistered(this.userInfo.type)
		// 	if (!result) {
		// 		return
		// 	}
		// 	//关闭红包特效
		// 	this.giftShow = false;
			
		// 	commonApi.grabRedPacket(redkey).then(res =>{
		// 		// 抢到红包，发送提醒
		// 		for (let i = 0; i < this.list.length; i++) {
		// 			if (this.list[i].type === '3' && this.list[i].redkey === redkey) {
		// 				this.list[i].state = '0';
		// 				this.$set(this.list, i, this.list[i]);
		// 			}
		// 		}

		// 		if (res.data.grabMoney != null) {
		// 			//that.grabMoney = res.data.grabMoney;
		// 			// 抢到红包需要广播  当前登录人 this.userInfo
		// 			var grabMoneyContent = this.userInfo.userName + " 抢到红包 " + res.data.grabMoney + "金币"
		// 			detailApi.sendLiveMsg(this.liveroomId,'4',grabMoneyContent).then(res =>{
						
		// 			})
					

		// 			layer.open({
		// 				content: $(".layer-not-grabbed").html().replace("grabMoney", res.data.grabMoney)
		// 				, skin: 'msg'
		// 				, time: 2 //2秒后自动关闭
		// 			});

		// 		} else {
		// 			//红包抢完
		// 			layer.open({
		// 				content: $(".layer-grab").html()
		// 				, skin: 'msg'
		// 				, time: 2 //2秒后自动关闭
		// 			});
		// 		}
		// 	})
		// },
		// //选中礼物
		// async openDialog(item) {
		// 	if (item.icon == this.giftSelected && item.type != 2) {
		// 		this.sendGift(item);
		// 	} else {
		// 		//选中礼物
		// 		this.giftSelected = item.icon;
		// 		//type=2红包
		// 		if (item.type == 2) {
		// 			//显示红包弹窗
		// 			const currentUser = commonApi.currentUserAxios();
		// 			this.userInfo = currentUser.data.session_user_h5;
		// 			this.redMoney = '';
		// 			this.redCount = '';
		// 			this.redTitle = '';
		// 			this.isRedEnvelope = true;
		// 		}
		// 	}
		// },
		// //发送礼物
		// async sendGift(item) {
		// 	// const result = await judgeIfPhone()
		// 	// if (!result) {
		// 	// 	return
		// 	// }
		// 	this.redPackageKey = '';
		// 	detailApi.liveSendGift(this.id,item.id,this.liveroomId).then(res =>{
				
		// 		if (res.data.code === 0) {
		// 			this.isGift = false
		// 			layer.closeAll()
		// 		} else {
		// 			if (res.data.errorCode === "501") {
		// 				//todo 账户余额不足,请充值,刷新账户
		// 				const currentUser = commonApi.currentUserAxios();
		// 				this.userInfo = currentUser.data.session_user_h5;
		// 				layer.open({
		// 					anim: '提示',
		// 					content: '余额不足,请充值',
		// 					btn: ['确定', '取消'],
		// 					yes: function (index) {
		// 						this.isGift = false
		// 						this.isTopUp = true;
		// 						layer.close(index)
		// 					},
		// 					no: function (index) {
		// 						layer.close(index)
		// 						this.isGift = false
		// 					}
		// 				});
		// 			} else if (res.data.errorCode == "502") {
		// 				layer.open({
		// 					anim: '提示',
		// 					content: res.data.msg,
		// 					btn: ['确定'],
		// 					yes: function (index) {
		// 						this.isGift = false;
		// 						layer.close(index)
		// 					}
		// 				});
		// 			}
		// 		}
		// 	})
		// },
		//客服电话
	 //   async showServiceTelList() {
		// 	// const result = await judgeIfPhone()
		// 	// if (!result) {
		// 	// 	return
		// 	// }
		// 	if (this.companyInfo.tel) {
		// 		this.callPhone()
		// 		layer.open({
		// 			type: 1 //Page层类型
		// 			//,area: ['300px', '100px']
		// 			, title: ''
		// 			, shade: 0.6 //遮罩透明度
		// 			, maxmin: true //允许全屏最小化
		// 			, anim: 1 //0-6的动画形式，-1不开启
		// 			, content: $('#phoneContactId').html()
		// 			, btn: ['<img style="position:fixed;bottom: 88px;left:50%;transform:translateX(-50%);z-index:999999999;width: 30px;height: 30px;margin: 0 auto" src="/statics/js/modules/h5/img/closs.png" alt="">']
		// 		});
		// 	} else {
		// 		this.noPhone()
		// 	}

		// },
		callPhone() {
			// const result = toRegistered(this.userInfo.type)
			// if (!result) {
			// 	return
			// }
			//电话沟通为6
			commonApi.recordBrowse(6, this.userInfo.id, this.companyInfo.id, 3)
		},
		chat() {
			// const result = toRegistered(this.userInfo.type)
			// if (!result) {
			// 	return
			// }
			// if (!this.ifJudged) {
			// 	toCompleteInformation()
			// 	return
			// }
			// window.location.href = '/h5/msgchat.html?toUserId=' + this.companyInfo.id
		},
		//没有提供客服电话提醒
		noPhone() {
			// if (!this.companyInfo.tel) {
			// 	layer.open({
			// 		anim: '提示',
			// 		content: '该企业没有提供客服电话',
			// 		btn: ['确定'],
			// 		yes: function (index) {
			// 			layer.close(index)
			// 		}
			// 	});
			// }
		},
		/**
		 *聊天定位 追加消息，并判断滚动条是否在底部
		 */
		addMsg() {
			let ele = document.getElementById('dialog');
			console.log(ele.scrollTop + ele.clientHeight, ele.scrollHeight)
			if ((ele.scrollTop + ele.clientHeight) == ele.scrollHeight) {
				this.oldStatus = 1;
			}
		},
		queryOnSaleProduct() {
			this.isGift = false;
			if (this.isProduct) {
				this.isProduct = false;
				return;
			} else {
				this.isProduct = true;
			}
			detailApi.queryOnSaleProduct(this.id,1,500).then(res =>{
				
				let resList = res.data.page.list
				if (resList.length > 0) {
					for (let i = 0; i < resList.length; i++) {
						if (resList[i].banarImg) {
							resList[i].banarImg = resList[i].banarImg.split(',')[0]
						}
					}
					this.productList = resList;
				} else {
					this.productList = [];
				}
			})
		},
		goLiveProDet(productId) {
			window.location.href = '/h5/livepromain.html?productId=' + productId
		},
		//校验支付金额是否合格
		prePay() {
			// if (this.rechargeMoney < 0.01) {
			// 	layer.open({
			// 		content: '每次充值不能低于一分钱'
			// 		, btn: '确定'
			// 		, yes(index) {
			// 			layer.close(index)
			// 		}
			// 	});
			// 	this.rechargeMoney = "";
			// 	return;
			// }
			// this.pay = 1
		},
		//充值接口
		// recharge() {
		// 	//判断
		// 	const result = toRegistered(this.userInfo.type);
		// 	if (!result) {
		// 		return
		// 	}
		// 	recharge(this.userInfo, this.rechargeMoney);
		// 	//清空充值数据
		// 	this.pay = 0;
		// 	this.rechargeMoney = ''
		// 	this.isTopUp = false

		// },
		// goBuy(productId) {
		// 	//--start 为防止子标签点击事件触发父标签点击事件
		// 	var ev = window.event || arguments.callee.caller.arguments[0];
		// 	if (window.event) ev.cancelBubble = true;
		// 	else {
		// 		ev.stopPropagation();
		// 	}
		// 	//--end 为防止子标签点击事件触发父标签点击事件
		// 	const result = toRegistered(this.userInfo.type);
		// 	if (!result) {
		// 		return
		// 	}
		// 	window.location.href = "/h5/submitOrders.html?proInfoStr=" + productId + ",1";
		// },
		//打开送礼物弹窗
		openGift() {
			//判断
			// const result = toRegistered(this.userInfo.type);
			// if (!result) {
			// 	return
			// }
			this.isProduct = false;
			if (this.isGift) {
				this.isGift = false;
			} else {
				this.isGift = true;
			}
		},
		//关闭充值弹窗
		closeCharge() {
			this.isTopUp = false;
			this.pay = 0;
			this.rechargeMoney = ''
		},
		changeRedMoney(e) {
			e.target.value = e.target.value.replace(/[^\d.]/g, ""); //清除“数字”和“.”以外的字符
			e.target.value = e.target.value.replace(/\.{2,}/g, "."); //只保留第一个. 清除多余的
			e.target.value = e.target.value.replace(".", "$#$").replace(/\./g, "").replace("$#$", ".");
			e.target.value = e.target.value.replace(/^(\-)*(\d+)\.(\d\d).*$/, '$1$2.$3');//只能输入两位小数
			// if(e.target.value.indexOf(".") < 0 && e.target.value != ""){
				//以上已经过滤，此处控制的是如果没有小数点，首位不能为类似于 01、02的金额
				e.target.value = parseFloat(e.target.value);
			// }
			this.redMoney = e.target.value;
		},
		changeRedCount(e){
			if (e.target.value.length == 1) {
				e.target.value = e.target.value.replace(/[^1-9]/g, '')
			} else {
				e.target.value = e.target.value.replace(/\D/g, '')
			}
			this.redCount = e.target.value
		},
		contentFocus(){
			// const result = toRegistered(this.userInfo.type);
			// if (!result) {
			// 	this.$refs.contentRef.blur();
			// 	return
			// }
			this.isProduct = false;
			this.isGift = false;
		},
		changeRechargeMoney(e){
			e.target.value = e.target.value.replace(/[^\d.]/g, ""); //清除“数字”和“.”以外的字符
			e.target.value = e.target.value.replace(/\.{2,}/g, "."); //只保留第一个. 清除多余的
			e.target.value = e.target.value.replace(".", "$#$").replace(/\./g, "").replace("$#$", ".");
			e.target.value = e.target.value.replace(/^(\-)*(\d+)\.(\d\d).*$/, '$1$2.$3');//只能输入两位小数
			if (e.target.value.indexOf(".") < 0 && e.target.value != "") {//以上已经过滤，此处控制的是如果没有小数点，首位不能为类似于 01、02的金额
				e.target.value = parseFloat(e.target.value);
			}
			this.rechargeMoney = e.target.value;
		},
	} 
}
</script>

<style lang="scss">
.head {
	position: relative;
	z-index: 3;
	background: #fff;
	.video {
		width: 100%;
	}
	.tabs {
		display: flex;

		font-size: $font-size-max;
		justify-content: space-between;

		.tab {
			width: 50%;
			text-align: center;
			border-bottom: 4rpx solid #fff;
			view {
				line-height: 70rpx;
				display: inline-block;
				margin-bottom: -3rpx;
				text {
					color: $text-color-grey;
				}
			}
		}
		.active {
			color: $color-primary;
			view {
				border-bottom: 4rpx solid $color-primary;
				text {
					color: $color-primary;
				}
			}
		}
	}
	.user {
		display: flex;
		align-items: center;
		justify-content: space-between;
		padding-bottom: $interval;
		padding: $interval-min $interval;
		.left {
			flex: 1;
			display: flex;
			align-items: center;
			.avatar {
				width: 70rpx;
				height: 70rpx;
				border-radius: 50%;
				margin-right: 15rpx;
			}
			.name {
				width: 0;
				flex: 1;
				color: #5a75a0;
				white-space: nowrap;
				overflow: hidden; //文本超出隐藏
				text-overflow: ellipsis; //文本超出省略号替代
			}
		}
		.btn {
			width: 116rpx;
			height: 52rpx;
			border: 2rpx solid #f63737;
			border-radius: 26rpx;
			color: #f63737;
			font-size: $font-size-min;
			display: flex;

			align-items: center;
			justify-content: center;
		}
		.btn_active {
			background-color: #f63737;
			color: #fff;
		}
	}
}
.scroll-view {
	height: calc(100vh - 660rpx);
	position: relative;
	.c {
		padding: $interval $interval 0rpx;
	}

	.commont-data {
		padding-bottom: 80rpx;
		.item {
			display: flex;
			justify-content: space-between;
			font-size: $font-size-min;
			margin-bottom: $interval-min;
			.left {
				display: flex;
				.custome {
					display: flex;
					justify-content: center;
					.avatar {
						width: 40rpx;
						height: 40rpx;
						border-radius: 50%;
					}
					.name {
						color: $color-primary;
						padding: 0px 10rpx;
					}
				}
				.text {
					flex: 1;
				}
			}
			.date {
				color: $text-color-grey;
				width: 130rpx;
				text-align: right;
			}
		}
	}
	.product-data-list {
		padding-bottom: 60rpx;
		margin-top: -1 * $interval;
		.type-price {
			display: flex;
			justify-content: space-between;
			align-items: center;
			padding-right: $interval;
			.type {
				color: $text-color-grey;
				font-size: $font-size-min;
			}
		}
	}

	.comment-data {
		margin-top: -1 * $interval;
		padding-bottom: 100rpx;
		background-color: $bg-color;
		> .item {
			margin: 0px -1 * $interval;
			padding: $interval $interval 0px;
			background-color: #fff;
			border-bottom: 10rpx solid $bg-color;
		}
		.user {
			.left {
				.avatar {
					width: 60rpx;
					height: 60rpx;
					border-radius: 50%;
					margin-right: 20rpx;
				}
				.name {
					color: #5a75a0;
				}
				.date {
					font-size: $font-size-min;
				}
			}
			.btn {
				color: $text-color;
				background: none;
			}
		}
		.text {
			padding-left: 80rpx;
		}
		.oper {
			padding-left: 80rpx;
			.item {
				display: flex;
				align-items: center;
				.img {
					margin-right: 10rpx;
				}
			}
		}
	}
}
.scroll-view1 {
	height: calc(100vh - 538rpx);
}
.fixed-btn{
	position: fixed;
	right: $interval;
	bottom: 130rpx;
	color: #fff;
	line-height: 70rpx;
	padding: 0px $interval-min;
	border-radius: 35rpx;
	background: $color-primary;
}
.liveDetail [alt]{width: 100%;}
.fixed-comment {
	height: 100rpx;
	background-color: #fff;
	z-index: 3;
	width: 100%;
	position: fixed;
	left: 0px;
	bottom: 0px;
	display: flex;
	align-items: center;
	input {
		height: 60rpx;
		border-radius: 30rpx;
		flex: 1;
		padding-left: $interval;
		background-color: $bg-color;
		margin-left: $interval;
		font-size: 24rpx;
	}
	.right {
		display: flex;
		margin-right: $interval;
		image {
			width: 52rpx;
			height: 52rpx;
			margin-left: $interval;
		}
	}
}
</style>
